<template>
	<view class="">
		<headerinfo></headerinfo>
		<view style="height: 100vh;overflow: hidden;" :class="useColorAsBg ==1?'bg100':''"
			:style="[{background:useColorAsBg == 1?`url(${familyBackground}) no-repeat center top`:familyBackground}]">
			<!-- <view class="mark"></view> -->
			<view class="" style="position: relative;z-index: 101;">
				<!-- <u-navbar :title="tabtitle" :placeholder="true" leftIconColor="#fff" :autoBack="true" :bgColor="bgColor"
					:titleStyle="titleStyle"></u-navbar> -->
				<!-- <headertop :inv="5"></headertop> -->
				<backos :type="1"></backos>

				<view class="addBtn addBtn3" @click="toCitang">
					<image src="../../../static/images/lingyuan.png" mode=""></image>
					<span>祠堂</span>
				</view>


				<view class="addBtn" @click="setNowPlace">
					<image src="../../../static/images/dingwei.png" mode=""></image>
					<span>定位到我</span>
				</view>

				<view class="addBtn addBtn2" @click="chengyuan">
					<image src="../../../static/images/addJt.png" mode=""></image>
					<span>成员列表</span>
				</view>
				<view class="addBtn addBtn4" @click="chengyuan">
					<image src="https://cdn-oss.familylove.online/user/kmh/image/laoke.jpg" mode=""></image>
					<span>唠嗑</span>
				</view>
				<div class="tree" v-if="treeData.length > 0">
					<div class="tree-content" @touchstart="move" @touchmove="moving"
						:style="{ top: positionX + 'px', left: positionY + 'px', transform: 'scale(' + scale + ')' }">
						<!-- @shareFamilyMember="shareFamilyMember"  -->
						<tree-item :tree-data="treeData" :depth='depth' :first_depth="depth" :tree-first="false" />
						<!-- :manageUsername="manageUsername" -->
					</div>
				</div>

				<div v-else>
					<nodata></nodata>
				</div>
			</view>



			<u-popup :show="showDia" :round="10" mode="center" @close="closeShowDia()" background-color="#fff">
				<view class="seeUserBox" style="width: 80vh;">
					<view class="header">

						<view class="seeMe">
							<image @click="priviewImg(global.checkedData.avatar)"
								v-if="global.checkedData.sex == 'male'"
								:src="global.checkedData.avatar?global.checkedData.avatar:'https://cdn-oss.familylove.online/user/kmh/image/male.jpg'"
								mode="aspectFill" style="width: 80rpx;height: 80rpx;border-radius: 50%;"></image>
							<image @click="priviewImg(global.checkedData.avatar)" v-else
								:src="global.checkedData.avatar?global.checkedData.avatar:'https://cdn-oss.familylove.online/user/kmh/image/female.jpg'"
								mode="aspectFill" style="width: 80rpx;height: 80rpx;border-radius: 50%;"></image>

							<view class="text">
								<view class="name">
									{{ global.checkedData.realname? global.checkedData.realname: global.checkedData.nickname? global.checkedData.nickname: global.checkedData.username }}
								</view>
								<!-- <view class="name nickname">{{ global.checkedData.nickname }}</view> -->

								<!-- <div class="list" @click="chat()">
									<i class="iconfont">&#xe8bd;</i>
									<span class="desc">AI对话</span>
								</div> -->
								<span class="small" @click.stop="chat"
									style="right: 167rpx;    color: #fff;border-color: #ef5c5c;background: #ef5c5c;">唠嗑</span>
								<span class="small" @click.stop="seeUserInfo">详情</span>
							</view>
						</view>
					</view>

					<div class="addUserlist">
						<div class="list disabled" v-if="!showAddFather">
							<span style="color: #de4849;">添加</span>
							<span class="desc">父亲</span>
						</div>
						<div class="list" v-else @click="addFamilyMember(1)">
							<span style="color: #de4849;">添加</span>
							<span class="desc">父亲</span>
						</div>

						<div class="list disabled" v-if="!showAddMonther">
							<span style="color: #de4849;">添加</span>
							<span class="desc">母亲</span>
						</div>
						<div class="list" v-else @click="addFamilyMember(2)">
							<span style="color: #de4849;">添加</span>
							<span class="desc">母亲</span>
						</div>
						<div class="list disabled" style="border-right: none;"
							v-if="global.checkedData.spouses && global.checkedData.spouses.length>0">
							<span style="color:#de4849;">添加</span>
							<span class="desc">配偶</span>
						</div>
						<div class="list" style="border-right: none;" v-else @click="addFamilyMember(3)">
							<span style="color: #de4849;">添加</span>
							<span class="desc">配偶</span>
						</div>
						<div class="list" @click="addFamilyMember(4)">
							<span style="color: #de4849;">添加</span>
							<span class="desc">儿子</span>
						</div>
						<div class="list" @click="addFamilyMember(5)">
							<span style="color: #de4849;">添加</span>
							<span class="desc">女儿</span>
						</div>
						<div class="list" style="border-right: none;" @click="toMyCard">
							<span style="color: #de4849;">我的名片</span>
							<span class="desc">{{ global.checkedData.nickname }}</span>
						</div>
					</div>
					<div class="addUserlist borderNoneBox" style="border: none;flex-wrap: inherit;">
						<!-- #ifdef MP-WEIXIN -->
						<div class="list" @click="shengcheng">
							<i class="iconfont">&#xe611;</i>
							<span class="desc">分享名片</span>
						</div>
						<!-- #endif -->

						<div class="list" @click="toTing" v-if="global.checkedData.passDate">
							<i class="iconfont">&#xe717;</i>
							<span class="desc">纪念厅</span>
						</div>

						<div class="list" @click="share" v-if="!global.checkedData.username">
							<i class="iconfont">&#xe6e8;</i>
							<span class="desc">邀请</span>
						</div>

						<div class="list" @click="changeUser()">
							<i class="iconfont">&#xe60a;</i>
							<span class="desc">修改</span>
						</div>
						<div class="list"
							v-if="global.checkedData.username && isAdmin && global.checkedData.username != username"
							@click="zhuanrang">
							<i class="iconfont">&#xe60c;</i>
							<span class="desc">禅让</span>
						</div>


						<div class="list" @click="delUser()"
							v-if="global.checkedData.username && isAdmin && global.checkedData.username != username">
							<i class="iconfont">&#xe645;</i>
							<span class="desc">踢出</span>
						</div>
						<div class="list" @click="deleteUser()"
							v-if="isAdmin && global.checkedData.username != username">
							<i class="iconfont">&#xe645;</i>
							<span class="desc">删除</span>
						</div>
						<div class="list" @click="outFamily()" v-if="global.checkedData.username == username">
							<i class="iconfont">&#xe60f;</i>
							<span class="desc">退出</span>
						</div>

					</div>
				</view>
			</u-popup>


			<u-popup :show="addFamilyMemberDia" :round="10" mode="center" @close="addFamilyMemberDia = false"
				background-color="#fff">
				<view class="createFirstForm">
					<view class="label">{{ diaTitle }}家庭成员</view>
					<view class="form">
						<view class="list">
							<div class="form_label">
								<span class="red">*</span>
								昵称
							</div>
							<u--input :adjust-position="false" placeholder="请输入昵称"
								v-model="addUserForm.familyMember.nickname" border="none"></u--input>
						</view>
						<view class="list">
							<div class="form_label">头像</div>

							<el-upload class="avatar-uploader" :auto-upload="false" :show-file-list="false"
								:on-change="handlePreview">
								<image v-if="addUserForm.familyMember.sex == 'male'"
									:src="addUserForm.familyMember.avatar?addUserForm.familyMember.avatar:'https://cdn-oss.familylove.online/user/kmh/image/male.jpg'"
									mode="aspectFill" style="width: 80rpx;height: 80rpx;border-radius: 50%;"></image>
								<image v-else
									:src="addUserForm.familyMember.avatar?addUserForm.familyMember.avatar:'https://cdn-oss.familylove.online/user/kmh/image/female.jpg'"
									mode="aspectFill" style="width: 80rpx;height: 80rpx;border-radius: 50%;"></image>
							</el-upload>


						</view>
						<view class="list">
							<div class="form_label">手机</div>
							<u--input :adjust-position="false" placeholder="请输入手机"
								v-model="addUserForm.familyMember.phone" border="none"></u--input>
						</view>
						<!-- <view class="list">
							<div class="form_label">年龄</div>
							<u--input :adjust-position="false" placeholder="请输入年龄" v-model="addUserForm.familyMember.age"
								border="none"></u--input>
						</view> -->
						<view class="list" @click="checkdateDia = true">
							<div class="form_label">出生年月</div>
							<div class="dateSpan">
								{{ addUserForm.familyMember.birthday ? addUserForm.familyMember.birthday : '请选择' }}
							</div>
						</view>
						<view class="list">
							<div class="form_label"> <span class="red">*</span>出生地</div>
							<u--input :adjust-position="false" placeholder="请输入出生地"
								v-model="addUserForm.familyMember.birthplace" border="none"></u--input>
						</view>
						<view class="list">
							<div class="form_label"> <span class="red">*</span>真实姓名</div>
							<u--input :adjust-position="false" placeholder="请输入真实姓名"
								v-model="addUserForm.familyMember.realname" border="none"></u--input>
						</view>
						<!-- <view class="list">
							<div class="form_label">
								<span class="red">*</span>
								性别
							</div>
							<u-radio-group v-model="addUserForm.familyMember.sex">
								<u-radio style="margin-right: 20rpx;" name="female" label="男"></u-radio>
								<u-radio name="male" label="女"></u-radio>
							</u-radio-group>
						</view> -->
						<view class="list">
							<div class="form_label">生平</div>
							<u--textarea v-model="addUserForm.familyMember.remark" placeholder="请输入生平"></u--textarea>
							<!-- 	<u--input :adjust-position="false" placeholder="请输入生平" v-model="addUserForm.familyMember.remark"
								border="none"></u--input> -->
						</view>
						<view class="list">
							<div class="form_label">是否在世</div>
							<u-radio-group v-model="radiovalue1" placement="row">
								<u-radio label="是" name="是">
								</u-radio>
								<u-radio label="否" name="否" style="margin-left: 20rpx;">
								</u-radio>
							</u-radio-group>
						</view>
						<view class="list" @click="checkdeldateDia = true" v-if="radiovalue1 == '否'">
							<div class="form_label">离世时间</div>
							<div class="dateSpan">
								{{ addUserForm.familyMember.passDate ? addUserForm.familyMember.passDate : '请选择' }}
							</div>
						</view>
					</view>

					<view class="createBtn" @click="$u.throttle(addUserFormSubmit, 800)">提交</view>
				</view>
			</u-popup>

			<u-popup :show="showShareDia" :round="10" mode="center" @close="showShareDia = false"
				background-color="#fff">
				<view class="showShare">
					<view id="imgimg" class="downLoadBox">
						<view class="text-center text-danger">
							邀请{{global.checkedData.realname?global.checkedData.realname:global.checkedData.nickname}}加入家庭{{familyData.familyName}}
						</view>

						<image :show-menu-by-longpress="true" :src="addimg" style="width: 500rpx;" mode="widthFix">
						</image>
						<!-- #ifdef MP-WEIXIN -->
						<view class="desc" style="text-align: center;font-size: 28rpx;color: #a8a4a4;">
							长按转发给朋友
						</view>
						<!-- #endif -->
						<!-- #ifndef MP-WEIXIN -->
						<view @click="saveQrcode" class="desc" style="text-align: center;font-size: 28rpx;">
							发送上面二维码给到家人微信</br>让家人长按或扫码即可加入家庭
						</view>
						<button style="text-align: center;font-size: 28rpx; margin-top: 20rpx; color:#de4849;"
							@click="saveQrcode" type="default">下载二维码</button>
						<!-- <view  style="text-align: center;font-size: 28rpx; margin-top: 20rpx; color:#de4849;" @click="saveQrcode">下载二维码</view> -->
						<!-- #endif -->
					</view>
					<!-- #ifdef MP-WEIXIN -->
					<view class="btns">
						<view style="width: 100%;"><button open-type="share" class="shareBtn"></button>直接分享</view>
					</view>
					<!-- #endif -->
				</view>

			</u-popup>

			<el-dialog title="" :visible.sync="chatDia" width="400">
				<view class="chatDiaBox">
					<view class="title">
						和亲人对话
					</view>
					<!-- <view class="check" @click="showlinkageVisible">
					{{guanxi?guanxi:'请选择和亲人的关系'}}
				</view> -->
					<el-cascader placeholder="请选择和亲人的关系" v-model="guanxi" @change="onConfirmguanxi" style="width: 100%;"
						:options="options"></el-cascader>


					<view class="checkduihua" @click="tochat()">
						<view class="listbox">
							<view class="btn">
								<span>立即开始</span>
							</view>

						</view>
					</view>
				</view>
			</el-dialog>


			<!-- 	<u-popup :show="chatDia" :round="10" mode="center" @close="chatDia = false" background-color="#fff">
				
		
			</u-popup> -->

			<w-picker :visible.sync="checkdateDia" mode="date" startYear="1631" endYear="2029"
				:value="addUserForm.familyMember.birthday" :current="false" fields="day" @confirm="onConfirm($event)"
				:disabled-after="false" ref="date1"></w-picker>
			<w-picker :visible.sync="checkdeldateDia" mode="date" startYear="1631" endYear="2029"
				:value="addUserForm.familyMember.passDate" :current="false" fields="day"
				@confirm="onConfirm2($event)"></w-picker>

			<w-picker :visible.sync="linkageVisible" mode="linkage" :options="options" :level="2" default-type="id"
				:default-props="defaultProps1" @confirm="onConfirmguanxi($event,'linkage')" ref="linkage"></w-picker>

			<u-popup :show="xcxDia" :round="10" mode="center" @close="xcxDia = false" background-color="#fff">
				<view class="wechatqun">
					<view class="title">
						{{global.checkedData.realname}}的名片
					</view>

					<!-- <image :show-menu-by-longpress="true" :src="xcxImg" mode="widthFix"></image> -->
					<tki-qrcode cid="qrcode23" ref="qrcode2" :iconSize="iconsize" :val="val2" :icon="icon" :size="size2"
						:onval="onval2" :loadMake="loadMake2" :usingComponents="true" @result="qrR2" />
					<view class="desc">
						长按转发给朋友
					</view>
					<view class="btns">
						<!-- #ifdef MP-WEIXIN -->
						<view style="width: 100%;">
							<view class="shareBtnsss" @click="shareImg">转发好友</view>
						</view>
						<!-- #endif -->
					</view>
				</view>
			</u-popup>
			<w-compress ref='wCompress' />

			<msg ref="message"></msg>
		</view>

		<el-dialog title="裁剪头像" :visible.sync="dialogVisible" width="500">
			<vueCropper class="crop-box" ref="cropper" :img="avatar" :autoCrop="options2.autoCrop"
				style="height: 400px;" :fixedBox="options2.fixedBox" :canMoveBox="options2.canMoveBox"
				:autoCropWidth="options2.autoCropWidth" :autoCropHeight="options2.autoCropHeight"
				:centerBox="options2.centerBox" :fixed="options2.fixed" :fixedNumber="options2.fixedNumber"
				:canMove="options2.canMove" :canScale="options2.canScale"></vueCropper>
			<span slot="footer" class="dialog-footer">
				<el-button @click="dialogVisible = false">取 消</el-button>
				<el-button type="primary" @click="gengxImg">确 定</el-button>
			</span>
		</el-dialog>
	</view>

</template>


<script>
	import treeItem from '@/components/tree-item/tree-item.vue';
	import tkiQrcode from "@/components/tki-qrcode/tki-qrcode.vue"
	import html2canvas from 'html2canvas'
	import {
		apiBaseURL
	} from '../../../common/config.js'
	import minxins from '@/common/upload.js';
	import WCompress from '@/components/w-compress/w-compress.vue'
	import avatar from "@/components/yq-avatar/yq-avatar.vue";
	import {
		VueCropper
	} from 'vue-cropper'
	export default {
		mixins: [minxins],
		components: {
			treeItem,
			tkiQrcode,
			WCompress,
			avatar,
			VueCropper

		},
		data() {
			return {
				avatar: '',
				dialogVisible: false,
				options2: {
					autoCrop: true, // 默认生成截图框
					fixedBox: false, // 固定截图框大小
					canMoveBox: true, // 截图框可以拖动
					autoCropWidth: 200, // 截图框宽度
					autoCropHeight: 200, // 截图框高度
					fixed: true, // 截图框宽高固定比例
					fixedNumber: [1, 1], // 截图框的宽高比例
					centerBox: true, // 截图框被限制在图片里面
					canMove: false, // 上传图片不允许拖动
					canScale: false // 上传图片不允许滚轮缩放
				},
				guanxi: '',
				linkageVisible: false,
				defaultProps1: {
					label: "name",
					value: "name",
					children: "child"
				},
				options: [{
					value: '同辈',
					label: '同辈',
					children: []
				}, {
					value: '小辈',
					label: '小辈',
					children: []
				}, {
					value: '长辈',
					label: '长辈',
					children: []
				}],
				chatDia: false,
				showtreeTip: '',
				addimg: '',
				xcxImg: '',
				xcxDia: false,
				radiovalue1: '是',
				iconsize: 40,
				val: '', // 要生成的二维码值
				size: 400, // 二维码大小
				onval: true, // val值变化时自动重新生成二维码
				loadMake: true, // 组件加载完成后自动生成二维码
				src: '', // 二维码生成后的图片地址或base64
				val2: '', // 要生成的二维码值
				size2: 400, // 二维码大小
				onval2: true, // val值变化时自动重新生成二维码
				loadMake2: true, // 组件加载完成后自动生成二维码
				src2: '', // 二维码生成后的图片地址或base64
				icon: '',
				familyData: {},
				tabtitle: '',
				bgColor: '#de4849',
				titleStyle: {
					color: '#fff'
				},
				familyId: '',
				showShareDia: false,
				treeData: [],
				global: this.$global,
				notShowDia: false,
				showDia: false,
				addFamilyMemberDia: false,
				// 滑动的参数
				distance: 0, //手指移动的距离
				scale: 1, //页面的比例
				disX: 0,
				disY: 0,
				positionX: 0,
				positionY: 0,
				diaTitle: '',
				checkdateDia: false,
				checkdeldateDia: false,
				isAdmin: true,
				addUserForm: {
					addFamilyMemberType: '',
					familyId: '',
					familyMember: {
						age: '',
						avatar: '',
						birthday: '',
						avatar: '',
						birthplace: '',
						image: '',
						nickname: '',
						phone: '',
						realname: '',
						remark: '',
						sex: 'male',
						passDate: '',
					},
					female: '',
					selfMemberId: '',
					selfSex: ''
				},
				showAddFather: true,
				showAddMonther: true,
				depth: 1,
				changepositionY: 10000000,
				changepositionX: 10000000,
				useColorAsBg: 1,
				familyBackground: '',
				username: uni.getStorageSync('username') ? uni.getStorageSync('username') : ''
			};
		},
		watch: {
			// global: {
			// 	handler(newName, oldName){
			// 		let checkedShare = uni.getStorageSync('checkedShare') ? uni.getStorageSync('checkedShare') : ''
			// 		if (checkedShare == 1) {
			// 			console.log('familylist handler',this.global.checkedData.id);
			// 			if(this.global.checkedData.id){
			// 				this.share()
			// 			}
			// 		} else {
			// 		}
			// 	},
			// 	deep: true
			// }
		},
		onUnload() {
			uni.$off('shareFamilyMember', () => {});
			uni.$off('showFamilyMemberCard', () => {})
		},
		onLoad(e) {
			console.log('familylist onLoad', e);

			uni.$on('shareFamilyMember', (item) => {
				this.share(item)
			})

			uni.$on('showFamilyMemberCard', (item) => {
				this.showMemberCard(item)
			})

			if (e.manageUsername) {
				let username = uni.getStorageSync('username') ? uni.getStorageSync('username') : ''
				this.global.manageUsername = e.manageUsername
				if (username == e.manageUsername) {
					this.isAdmin = true
				} else {
					this.isAdmin = false
				}

				console.log(username)
				console.log(e.manageUsername)
				console.log(this.isAdmin)
			}


			this.useColorAsBg = e.useColorAsBg
			this.familyBackground = e.familyBackground

			if (e.id) {
				this.familyId = e.id
				this.getData();
			}


		},
		onShow() {
			this.showtreeTip = uni.getStorageSync('showtreeTip') ? uni.getStorageSync('showtreeTip') : ''
			if (!this.showtreeTip) {
				uni.showModal({
					title: '提示',
					content: '点击成员头像可进行更多操作',
					confirmText: '我知道了',
					showCancel: false,
					success: (res) => {
						if (res.confirm) {
							this.showtreeTip = 1
							uni.setStorageSync('showtreeTip', 1)
						}
					}
				});
			}
			let needRefresh = uni.getStorageSync('needRefresh')
			console.log('familylist needRefresh', needRefresh);
			if (needRefresh) {
				uni.setStorageSync('needRefresh', '')
				this.getData()
			}
		},
		methods: {
			// shareFamilyMember(item){
			// 	console.log('shareFamilyMember received',item);
			// 	this.share(item)
			// },

			showMemberCard(item) {
				this.global.checkedData = item
				if (!this.notShowDia) {

					console.log(this.treeData)
					console.log(this.global.checkedData)
					this.showAddFather = true
					this.showAddMonther = true
					if (this.global.checkedData.parents && this.global.checkedData.parents.length > 0) {
						if (this.global.checkedData.parents.length > 1) {
							// 有2个数据 说明已经添加了父亲和母亲
							this.showAddFather = this.showAddMonther = false
						} else {
							let parentid = this.global.checkedData.parents[0]
							this.treeData.forEach(item => {
								if (item.id == parentid) {
									if (item.sex == "male") {
										this.showAddFather = false
									} else {
										this.showAddMonther = false
									}
								}
							})
						}
					}
					if (this.global.checkedData.spouses && this.global.checkedData.spouses.length > 0) {
						let spousesid = this.global.checkedData.spouses[0]
						this.treeData.forEach(item => {
							if (item.id == spousesid) {
								if (item.parents && item.parents.length > 0) {
									this.showAddFather = false
									this.showAddMonther = false
								}
							}
						})
					}
					this.showDia = true;
				} else {
					this.notShowDia = false;
				}
			},
			gengxImg() {
				this.$refs.cropper.getCropBlob(data => {
					console.log(data)

					const tempFilePaths = URL.createObjectURL(data);

					// 限制 300K
					var fileName = Date.now() + '_' + Math.round(Math.random() *
						100000000) + '.' + 'cejdjwqij' + '.png'



					// this.uploadUserImage(tempFilePaths, 'image', fileName, '', (
					// 	avatarUrl) => {
					// 	this.$api.changeAvatar({
					// 		avatarUrl
					// 	}).then(res => {
					// 		this.dialogVisible = false
					// 		this.$message.success('修改成功')
					// 		this.getData()
					// 	})
					// })
					var familyId = uni.getStorageSync('familyId') ? uni.getStorageSync('familyId')[0] : ''

					this.uploadUserImage(tempFilePaths, 'image', fileName, familyId, (
						imgUrl) => {
						this.addUserForm.familyMember.avatar = imgUrl;
						this.dialogVisible = false
						this.addFamilyMemberDia = true
						this.$forceUpdate()
						console.log(this.addUserForm.familyMember.avatar)
					})

				})
			},
			handlePreview(file) {
				this.avatar = URL.createObjectURL(file.raw)
				this.addFamilyMemberDia = false
				this.dialogVisible = true
			},
			showlinkageVisible() {
				console.log(this.options)
				this.linkageVisible = true
			},
			tochat() {

				this.chatDia = false
				let guanxi = this.guanxi
				let familyMemberId = this.global.checkedData.id
				let avatar = this.global.checkedData.avatar ? this.global.checkedData.avatar : ''
				let familyId = this.global.checkedData.familyId ? this.global.checkedData.familyId : ''

				uni.navigateTo({
					url: `/pages/chat/chat?guanxi=${guanxi}&familyMemberId=${familyMemberId}&avatar=${avatar}&familyId=${familyId}`
				})
			},
			toCitang() {
				let museumId = this.familyData.museumId ? this.familyData.museumId : ''
				let familyId = this.global.checkedData.familyId
				console.log('museumId', museumId);
				console.log('familyId', familyId);
				if (museumId) {
					uni.navigateTo({
						url: `/pagesobit/obit/citang?id=${museumId}`
					})

				} else {
					this.$Show.show('请先创建祠堂')
					setTimeout(() => {
						// 去创建祠堂
						uni.navigateTo({
							url: `/pagesobit/obit/create?docId=${familyId}`
						})
					}, 2000)
				}
			},
			toTing() {

				let userid = this.global.checkedData.id
				let familyId = this.global.checkedData.familyId
				let museumId = this.familyData.museumId ? this.familyData.museumId : ''
				let checkedData = JSON.stringify(this.global.checkedData)

				if (museumId) {
					// 有祠堂
					if (this.global.checkedData.hallId) {
						uni.navigateTo({
							url: `/pagesobit/obit/tingInfo?hallId=${this.global.checkedData.hallId}`
						})
					} else {
						uni.navigateTo({
							url: `/pagesobit/obit/createting?userid=${userid}&familyId=${familyId}&museumId=${museumId}&hallId=${this.global.checkedData.hallId}&checkedData=${checkedData}`
						})
					}
				} else {
					this.$Show.show('请先创建祠堂')
					setTimeout(() => {
						// 去创建祠堂
						uni.navigateTo({
							url: `/pagesobit/obit/create?docId=${familyId}`
						})
					}, 2000)

				}




			},
			shareImg() {

				wx.showShareImageMenu({ //分享给朋友
					path: this.src2,
					success: (res) => {
						console.log("分享成功：", res);
					},
					fail: (err) => {
						console.log("分享取消：", err);
					},
				})
				// let that = this
				// this.base64ToFilePath(this.src2, (filePath) => {
				// 	console.log(filePath);

				// })
			},
			base64ToFilePath(base64data, fun) { //封装的base64转换成临时文件路径的函数
				const base64 = base64data; //base64格式图片
				const time = new Date().getTime();
				const imgPath = wx.env.USER_DATA_PATH + "/addFriends" + time + "share_qrcode" +
					".png"; //去掉data:image/png;base64,如果图片字符串不含要清空的前缀,可以不执行下行代码.
				const imageData = base64.replace(/^data:image\/\w+;base64,/, "");
				const file = wx.getFileSystemManager();
				file.writeFileSync(imgPath, imageData, "base64");
				fun(imgPath);
			},
			// 分享给好友
			onShareAppMessage(options) {

				var that = this;

				let inviterFamilyId = that.familyData.docId
				let inviterUsername = uni.getStorageSync('username') ? uni.getStorageSync('username') : ''
				let matchedFamilyMemberId = that.global.checkedData.id

				var shareObj = {
					title: `邀请${that.global.checkedData.nickname}加入${that.familyData.familyName}`, // 默认是小程序的名称(可以写slogan等)
					desc: '', // 小程序的描述
					path: `/pages/tabbar/index/index?inviterFamilyId=${inviterFamilyId}&inviterUsername=${inviterUsername}&matchedFamilyMemberId=${matchedFamilyMemberId}`, // 默认是当前页面，必须是以‘/’开头的完整路径
					imageUrl: '', // 图片封面，本地文件路径、网络图片路，支持PNG及JPG，默认当前页面截图，显示图片长宽比是 5:4。
					success: function(res) {
						// 转发成功之后的回调

						if (res.errMsg == 'shareAppMessage:ok') {
							console.log(res)

						}
					},

				}

				// 返回shareObj
				return shareObj;
			},
			chooseImage(e) {
				var fileName = Date.now() + '_' + Math.round(Math.random() * 100000000) + '.' + e.path.substring(e.path
					.lastIndexOf('.') + 1)

				var familyId = uni.getStorageSync('familyId') ? uni
					.getStorageSync('familyId')[0] : ''

				this.uploadUserImage(e.path, 'image', fileName, familyId, (
					imgUrl) => {
					this.addUserForm.familyMember.avatar = imgUrl;
					this.$forceUpdate()
					console.log(this.addUserForm.familyMember.avatar)
				})

				// uni.chooseImage({
				// 	count: 1,
				// 	success: res => {
				// 		// #ifdef MP-WEIXIN

				// 		this.$refs.wCompress.start(res.tempFilePaths).then(res2 => {
				// 			res2.forEach((item, index) => {
				// 				var fileName = Date.now() + '_' + Math.round(Math.random() *
				// 					100000000) + '.' + item.substring(item.lastIndexOf(
				// 					'.') + 1)

				// 				var maxImageMegBytes = uni.getStorageSync('maxImageMegBytes') ?
				// 					uni.getStorageSync('maxImageMegBytes') : 20

				// 				var resSize = res.tempFiles[index].size;
				// 				if (resSize > maxImageMegBytes * 1024 * 1024) {
				// 					uni.showToast({
				// 						title: `大小不能超过${maxImageMegBytes}MB`,
				// 						icon: 'none'
				// 					});
				// 					return
				// 				}

				// 				var familyId = uni.getStorageSync('familyId') ? uni
				// 					.getStorageSync('familyId')[0] : ''

				// 				this.uploadUserImage(item, 'image', fileName, familyId, (
				// 					imgUrl) => {
				// 					this.addUserForm.familyMember.avatar = imgUrl;
				// 					this.$forceUpdate()
				// 					console.log(this.addUserForm.familyMember.avatar)
				// 				})


				// 			})
				// 		})
				// 		// #endif
				// 		// #ifndef MP-WEIXIN
				// 		for (let i = 0; i < res.tempFiles.length; i++) {
				// 			console.log(res)
				// 			let item = res.tempFiles[i]

				// 			console.log(item)

				// 			// #ifdef APP-PLUS
				// 			let houzui = item.path.substring(item.path.lastIndexOf('.') + 1)
				// 			// #endif

				// 			// #ifdef H5
				// 			let houzui = item.name.substring(item.name.lastIndexOf('.') + 1)
				// 			// #endif

				// 			let name = Date.now() + '_' + Math.round(Math.random() * 100000000)
				// 			let path = item.path
				// 			let fileName = name + '.' + houzui

				// 			let maxImageMegBytes = uni.getStorageSync('maxImageMegBytes') ? uni.getStorageSync(
				// 				'maxImageMegBytes') : 20

				// 			let resSize = item.size;
				// 			if (resSize > maxImageMegBytes * 1024 * 1024) {
				// 				uni.showToast({
				// 					title: `大小不能超过${maxImageMegBytes}MB`,
				// 					icon: 'none'
				// 				});
				// 				return
				// 			}


				// 			let familyId = uni.getStorageSync('familyId') ? uni.getStorageSync('familyId')[0] :
				// 				''


				// 			// #ifdef APP-PLUS
				// 			uni.compressImage({
				// 				src: path,
				// 				quality: 30,
				// 				compressedWidth: 300,
				// 				success: res => {
				// 					this.uploadUserImage(res.tempFilePath, 'image', fileName,
				// 						familyId, (
				// 							imgUrl) => {
				// 							this.addUserForm.familyMember.avatar = imgUrl;
				// 							this.$forceUpdate()
				// 							console.log(this.addUserForm.familyMember.avatar)
				// 						})
				// 				}
				// 			})
				// 			// #endif
				// 			// #ifdef H5
				// 			//压缩图片
				// 			this.getImageInfo(path).then(fileUrl => {
				// 				this.uploadUserImage(fileUrl, 'image', fileName, familyId, (
				// 					imgUrl) => {
				// 					this.addUserForm.familyMember.avatar = imgUrl;
				// 					this.$forceUpdate()
				// 					console.log(this.addUserForm.familyMember.avatar)
				// 				})
				// 			})
				// 			// #endif

				// 		}
				// 		// #endif

				// 	}
				// });
			},
			priviewImg(img) {
				this.showDia = false;
				uni.previewImage({
					urls: [img],
					current: 0
				})
			},
			setNowPlace() {

				// #ifdef MP-WEIXIN

				console.log(this.global)
				if (this.changepositionX == this.positionX && this.changepositionY == this.positionY) {
					return
				}
				if (this.global.xy) {
					this.positionX = 0;
					this.positionY = 0;

					setTimeout(() => {

						let getWindowInfo = uni.getWindowInfo()
						console.log(getWindowInfo.screenWidth); //屏幕宽度

						this.changepositionY = this.positionY = getWindowInfo.screenWidth / 2 - (this
							.global.xy
							.width / 2) - this.global.xy.left;
						this.changepositionX = this.positionX = getWindowInfo.screenHeight / 2 - (this
							.global.xy
							.height / 2) - this.global.xy.top;
					})
				} else {
					return this.$Show.show('当前家庭没有我')
				}





				// #endif

				// #ifndef MP-WEIXIN
				if (this.changepositionX == this.positionX && this.changepositionY == this.positionY) {
					return
				}

				this.positionX = 0;
				this.positionY = 0;
				setTimeout(() => {

					let getWindowInfo = uni.getWindowInfo()
					console.log(getWindowInfo.screenWidth); //屏幕宽度
					let myName = uni.getStorageSync('nickname');



					let id = '#userBox' + myName;
					const query = uni.createSelectorQuery().in(this);
					query
						.select(id)
						.boundingClientRect(data => {
							console.log('当前定位的数据');
							this.changepositionY = this.positionY = getWindowInfo.screenWidth / 2 - (
								data
								.width / 2) - data.left;
							this.changepositionX = this.positionX = getWindowInfo.screenHeight / 2 - (
								data
								.height / 2) - data.top;
							console.log(data)
						})
						.exec();
				})
				// #endif


			},
			qrR(res) {
				this.src = res
			},
			qrR2(res) {
				this.src2 = res
			},
			toMyCard() {
				console.log(this.global.checkedData)
				let id = this.global.checkedData.id
				let username = this.global.checkedData.username ? this.global.checkedData.username : ''
				if (username) {
					uni.navigateTo({
						url: `/pages/card/index?id=${id}&username=${username}&card=1`
					})
				} else {
					uni.navigateTo({
						url: `/pages/card/index?id=${id}&card=1`
					})
				}

			},
			getData() {
				uni.showLoading({
					title: '加载中...'
				});

				let data = {
					familyId: this.familyId
				}
				this.treeData = []
				this.$api.getFamilyInfoByFamilyId(data).then(res => {
					uni.setStorageSync('myFamilyIndexs', []);

					res.members.sort((a, b) => {
						return a.depth - b.depth
					})
					this.depth = res.members[0].depth

					this.treeData = res.members;
					this.familyData = res.family
					this.tabtitle = this.familyData.familyName
					uni.hideLoading();

				})
			},
			chengyuan() {
				let familyId = this.familyId
				uni.navigateTo({
					url: `/pages/tabbar/family/familyInfo2?familyId=${familyId}`
				})
			},
			restUserForm() {
				this.addUserForm = {
					addFamilyMemberType: '',
					familyId: '',
					familyMember: {
						age: '',
						birthday: '',
						birthplace: '',
						image: '',
						nickname: '',
						phone: '',
						realname: '',
						remark: '',
						sex: 'male'
					},
					female: '',
					selfMemberId: '',
					selfSex: ''
				};
			},
			//添加家庭成员弹窗
			addFamilyMember(type) {
				this.showDia = false;
				this.diaTitle = '添加';
				this.restUserForm()

				if (type == 1) {
					//添加父亲
					this.addUserForm.familyId = this.global.checkedData.familyId;
					this.addUserForm.addFamilyMemberType = 'addParent';
					this.addUserForm.familyMember.sex = 'male';
				} else if (type == 2) {
					//添加母亲
					this.addUserForm.familyId = this.global.checkedData.familyId;
					this.addUserForm.addFamilyMemberType = 'addParent';
					this.addUserForm.familyMember.sex = 'female';
				} else if (type == 3) {
					//添加配偶
					this.addUserForm.familyId = this.global.checkedData.familyId;
					this.addUserForm.addFamilyMemberType = 'addSpouse';
					if (this.global.checkedData.sex == 'female') {
						this.addUserForm.familyMember.sex = 'male';
					} else {
						this.addUserForm.familyMember.sex = 'female';
					}
				} else if (type == 4) {
					//添加儿子
					this.addUserForm.familyId = this.global.checkedData.familyId;
					this.addUserForm.addFamilyMemberType = 'addChild';
					this.addUserForm.familyMember.sex = 'male';
				} else if (type == 5) {
					//添加女儿
					this.addUserForm.familyId = this.global.checkedData.familyId;
					this.addUserForm.addFamilyMemberType = 'addChild';
					this.addUserForm.familyMember.sex = 'female';
				} else {
					//添加平级
					this.addUserForm.familyId = this.global.checkedData.familyId;
					this.addUserForm.addFamilyMemberType = 'root';
				}

				this.addUserForm.selfSex = this.global.checkedData.sex ? this.global.checkedData.sex : 'female';
				this.addUserForm.selfMemberId = this.global.checkedData.id;

				this.addFamilyMemberDia = true;
			},
			addUserFormSubmit() {
				if (this.addUserForm.familyMember.nickname == '') {
					return this.$Show.show('请填写昵称');
				}
				if (this.addUserForm.familyMember.sex == '') {
					return this.$Show.show('请选择性别');
				}


				if (this.addUserForm.familyMember.birthday == '') {
					return this.$Show.show('请选择出生年月');
				}


				if (this.addUserForm.familyMember.realname == '') {
					return this.$Show.show('请输入真实姓名');
				}



				if (this.diaTitle == '修改') {
					uni.showLoading({
						title: '请稍等..',
						mask: true
					})


					console.log(this.addUserForm)
					let familyMember = this.addUserForm.familyMember
					let formQuery = {
						avatar: familyMember.avatar,
						birthday: familyMember.birthday,
						birthplace: familyMember.birthplace,
						familyId: this.addUserForm.familyId,
						familyMemberId: this.addUserForm.familyMemberId,
						nickname: familyMember.nickname,
						passDate: familyMember.passDate,
						phone: familyMember.phone,
						realname: familyMember.realname,
						remark: familyMember.remark,
						sex: familyMember.sex,
					}
					this.$api.updateFamilyMember(formQuery).then(res => {
						this.$Show.show('修改成功');
						this.addFamilyMemberDia = false;
						uni.hideLoading()
						this.getData();
						this.$forceUpdate()
						// 更新就不问了，自己去添加吧，不然每次更新都会重复问
						// if (familyMember.passDate) {
						// 	uni.showModal({
						// 		title: '添加事件提醒',
						// 		content: `是否添加${familyMember.nickname}的忌日为${familyMember.passDate}`,
						// 		success: (res) => {
						// 			if (res.confirm) {
						// 				let formData = {
						// 					startTime: '00:00:00',
						// 					title: familyMember.nickname + '的忌日',
						// 					date: familyMember.passDate,
						// 					repeat: 'year'
						// 				}
						// 				this.$api.calendarupsert(formData).then(res => {
						// 					this.$Show.show('添加成功')
						// 				})
						// 			}
						// 		}
						// 	});
						// }
					});
				} else {
					uni.showLoading({
						title: '请稍等..',
						mask: true
					})
					this.$api.addFamilyMember(this.addUserForm).then(res => {
						this.$Show.show('添加成功');
						this.addFamilyMemberDia = false;
						uni.hideLoading()
						this.getData();
						this.$forceUpdate()
						if (familyMember.passDate) {
							uni.showModal({
								title: '添加事件提醒',
								content: `是否添加${familyMember.nickname}的忌日为${familyMember.passDate}`,
								success: (res) => {
									if (res.confirm) {
										let formData = {
											startTime: '00:00:00',
											title: familyMember.nickname + '的忌日',
											date: familyMember.passDate,
											repeat: 'year'
										}
										this.$api.calendarupsert(formData).then(res => {
											this.$Show.show('添加成功')
										})
									}
								}
							});
						}
					});
				}
			},
			copyaddress() {
				uni.setClipboardData({
					data: this.val,
					success: function() {
						uni.showToast({
							title: '复制成功',
							icon: 'none'
						})
					}
				})
			},
			onConfirm(e) {
				this.addUserForm.familyMember.birthday = e.value;
			},
			changeUser() {
				this.showDia = false;
				this.diaTitle = '修改';

				this.addUserForm.familyId = this.global.checkedData.familyId;
				this.addUserForm.selfSex = this.global.checkedData.sex ? this.global.checkedData.sex : 'female';
				this.addUserForm.familyMemberId = this.global.checkedData.id;

				if (this.global.checkedData.passDate) {
					this.radiovalue1 = '否'
				} else {
					this.radiovalue1 = '是'
				}
				this.addUserForm.familyMember = JSON.parse(JSON.stringify(this.global.checkedData));
				this.addFamilyMemberDia = true;
			},
			zhuanrang() {
				this.showDia = false;
				var desc = `是否确定将权限禅让给${this.global.checkedData.nickname}？`

				uni.showModal({
					title: '提示',
					content: desc,
					success: res => {
						if (res.confirm) {
							let data = {
								familyId: this.global.checkedData.familyId,
								familyMemberId: this.global.checkedData.id
							};
							this.$api.transferFamilyManager(data).then(res => {
								this.treeData = []
								this.$Show.show('操作成功');
								this.global.manageUsername = this.global.checkedData.username
								this.getData();
								this.isAdmin = false
								this.$forceUpdate()
							});
						}
					}
				});
			},
			share(item) {
				this.global.checkedData = item
				console.log('familylist share item', item);
				// global.checkedData.realname?global.checkedData.realname:global.checkedData.nickname
				let inviterFamilyId = this.familyData.docId
				let inviterUsername = uni.getStorageSync('username') ? uni.getStorageSync('username') : ''
				let matchedFamilyMemberId = item.id
				console.log('familylist this.global.checkedData', matchedFamilyMemberId, this.global.checkedData)
				let data = {
					envVersion: 'trial',
					path: `/pages/tabbar/index/index?inviterFamilyId=${inviterFamilyId}&inviterUsername=${inviterUsername}&matchedFamilyMemberId=${matchedFamilyMemberId}`,
					width: '430',
					base: {
						requestId: Math.floor(Math.random() * 1000000000) + '',
						clientId: 'minghui',
						debugMore: false
					}
				}
				var that = this

				uni.request({
					url: `${apiBaseURL}/getWxWpACode`,
					data: data,
					responseType: 'arraybuffer', //必填项，否则保存不了arrayBuffer格式
					method: "POST",
					header: {
						'content-type': 'application/json'
					},
					success(res) {
						console.log(res)
						const arrayBuffer = new Uint8Array(res.data) //将二进制数据保存为arrayBuffer格式

						that.addimg = 'data:image/png;base64,' + uni.arrayBufferToBase64(arrayBuffer)
					},
					fail(e) {}
				})


				this.showShareDia = true
				this.showDia = false

			},
			onConfirm2(e) {
				this.addUserForm.familyMember.passDate = e.value;
			},
			// 踢出成员
			delUser() {
				this.showDia = false;
				var desc = `是否确认踢出${this.global.checkedData.nickname}？`
				if (this.global.checkedData.children && this.global.checkedData.children.length > 0) {
					desc = '您删除的家庭成员已经有用户绑定了，如果删除会导致该用户从当前家庭踢出，确认要删除当前成员吗？'
				}

				uni.showModal({
					title: '提示',
					content: desc,
					success: res => {
						if (res.confirm) {
							let data = {
								familyId: this.global.checkedData.familyId,
								familyMemberId: this.global.checkedData.id
							};
							this.$api.kickoffFamilyMember(data).then(res => {
								this.$Show.show('踢出成功');
								this.getData();
								this.$forceUpdate()
							});
						}
					}
				});

			},
			deleteUser() {
				if (this.global.checkedData.children.length > 0 && this.global.checkedData.children.parents > 0) {
					return this.$Show.show('请先删除子节点的成员')
				}
				this.showDia = false;
				var desc = `是否确认删除该成员？`
				uni.showModal({
					title: '提示',
					content: desc,
					success: res => {
						if (res.confirm) {
							let data = {
								familyId: this.global.checkedData.familyId,
								familyMemberId: this.global.checkedData.id
							};
							this.$api.deleteFamilyMemberById(data).then(res => {
								console.log(res)
								this.$Show.show('删除成功');
								this.getData();
								this.$forceUpdate()
							}).catch(err => {
								this.$refs.message.show({
									type: 'warning',
									msg: err,
								});
							});
						}
					}
				});
			},
			outFamily() {
				this.showDia = false;
				var desc = `是否确认退出家庭？`
				uni.showModal({
					title: '提示',
					content: desc,
					success: res => {
						if (res.confirm) {
							let data = {
								familyId: this.global.checkedData.familyId,
								familyMemberId: this.global.checkedData.id
							};
							this.$api.quitFamily(data).then(res => {
								this.$Show.show('退出成功');
								this.getData();
							});
						}
					}
				});
			},
			chat() {
				this.showDia = false;

				let data = {
					familyMemberId: this.global.checkedData.id
				}
				this.$api.queryFamilyMemberRelation(data).then(res => {
					if (res) {
						this.guanxi = res
					}
					this.$api.getRelation(data).then(res2 => {
						console.log(res2)
						let tongbei = []
						if (res2.equal.length > 0) {
							res2.equal.forEach(item => {
								tongbei.push({
									value: item,
									label: item,
								})
							})
						}

						let xiaobei = []
						if (res2.younger.length > 0) {
							res2.younger.forEach(item => {
								xiaobei.push({
									value: item,
									label: item,
								})
							})
						}

						let zhangbei = []
						if (res2.elder.length > 0) {
							res2.elder.forEach(item => {
								zhangbei.push({
									value: item,
									label: item,
								})
							})
						}

						this.options[0].children = tongbei
						this.options[1].children = xiaobei
						this.options[2].children = zhangbei

						this.chatDia = true
					})





				})
			},
			onConfirmguanxi(e) {


				// 绑定关系	
				let data = {
					relation: e[1],
					familyMemberId: this.global.checkedData.id
				}
				this.$api.upsertFamilyMemberRelation(data).then(res => {
					console.log(res)
					this.guanxi = e[1]

				})
			},
			saveQrcode() {
				html2canvas(document.querySelector("#imgimg"), {
					useCORS: true
				}).then(canvas => {
					const file = document.createElement("a");
					file.style.display = "none";
					file.href = canvas.toDataURL("image/jpg");
					file.download = decodeURI('小程序二维码');
					document.body.appendChild(file);
					file.click();
					document.body.removeChild(file);
				});
			},
			closeShowDia() {
				this.showDia = false;
			},
			// 双指触发开始计算出发时两个手指的坐标距离
			touchstartCallback(e) {
				// 单手指缩放开始，不做任何处理
				if (e.touches.length == 1) return;
				// 当两根手指放上去的时候，将距离(distance)初始化。
				let xMove = e.touches[1].clientX - e.touches[0].clientX;
				let yMove = e.touches[1].clientY - e.touches[0].clientY;
				//计算开始触发两个手指坐标的距离
				this.distance = Math.sqrt(xMove * xMove + yMove * yMove);
			},
			// 双指移动计算两个手指的坐标距离
			touchmoveCallback(e) {
				// 单手指缩放不做任何操作
				if (e.touches.length == 1) return;
				//双手指运动 x移动后的坐标和y移动后的坐标
				let xMove = e.touches[1].clientX - e.touches[0].clientX;
				let yMove = e.touches[1].clientY - e.touches[0].clientY;
				//双手指运动新的 ditance
				let distance = Math.sqrt(xMove * xMove + yMove * yMove);
				//计算移动的过程中实际移动了多少的距离
				let distanceDiff = distance - this.distance;
				let newScale = this.scale + 0.0001 * distanceDiff;
				this.scale = newScale;
				// 为了防止缩放得太大，所以scale需要限制，同理最小值也是
				if (newScale >= 5) {
					newScale = 5;
					this.distance = distance;
					this.scale = newScale;
				}
				//为了防止缩放得太小，所以scale需要限制
				if (newScale <= 0.7) {
					newScale = 0.7;
					this.distance = distance;
					this.scale = newScale;
				}
			},
			// 拖拽移动
			move(e) {
				const odiv = e.currentTarget; // 获取元素
				// 算出鼠标相对元素的位置
				// if (e.touches.length == 2) return this.touchstartCallback(e);
				this.disX = e.touches[0].clientX - odiv.offsetLeft;
				this.disY = e.touches[0].clientY - odiv.offsetTop;

			},
			// 移动中
			moving(e) {
				// if (e.touches.length == 2) return this.touchmoveCallback(e);
				// console.log(e)
				// 用鼠标的位置减去鼠标相对元素的位置，得到元素的位置
				let left = e.touches[0].clientX - this.disX;
				let top = e.touches[0].clientY - this.disY;

				// 绑定元素位置到positionX和positionY上面
				this.positionX = top;
				this.positionY = left;

				this.changepositionY = 10000000,
					this.changepositionX = 10000000,

					console.log(this.positionX)
				console.log(this.positionY)
			},
			seeUserInfo(e) {
				this.showDia = false
				let id = this.global.checkedData.id
				uni.navigateTo({
					url: `/pages/tabbar/family/familyInfo?id=${id}`
				});
			},
			createErweima() {
				let username = this.global.checkedData.username ? this.global.checkedData.username : ''
				let realname = this.global.checkedData.realname ? this.global.checkedData.realname : ''
				let id = this.global.checkedData.id

				console.log(this.global.checkedData)
				let path = ''
				if (username) {
					path = `username=${username}&id=${id}`
				} else {
					path = `id=${id}`
				}

				this.val2 = `https://familylovetop.oss-cn-shanghai.aliyuncs.com?${path}`

				console.log(this.val2)

				this.showDia = false

				this.xcxDia = true
			},
			shengcheng() {

				uni.navigateTo({
					url: '/pages/card/sharecard'
				})

				let avatar = this.global.checkedData.avatar ? this.global.checkedData.avatar : ''


				// if (avatar) {
				// 	uni.downloadFile({
				// 		url: avatar,
				// 		success: (res) => {
				// 			console.log(res)
				// 			this.icon = res.tempFilePath

				// 			this.createErweima()
				// 			console.log(this.icon)
				// 		}
				// 	})
				// } else {
				// 	this.icon = '/static/images/logo.png'
				// 	this.createErweima()
				// }

			}
		}
	};
</script>

<style>
	page {
		background-color: #e6e7df;
		/* background-image: url(); */
	}
</style>

<style lang="scss">
	.mark {
		position: fixed;
		bottom: 0;
		right: 0;
		top: 0;
		left: 0;
		opacity: .2;
		background-color: #000;
		z-index: 1;
	}

	.bg100 {
		// background-size:100% 100%;
		background-size: cover !important;
	}

	.tree {
		height: 100vh;
		position: relative;
		overflow: hidden;

		.tree-content {
			min-height: 100%;
			// transform: scale(0.5);
		}
	}

	.addBtn {
		padding: 20rpx;
		position: fixed;
		bottom: 150rpx;
		right: 30rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		z-index: 100;

		image {
			width: 80rpx;
			background-color: #fff;
			height: auto;
			height: 80rpx;
			padding: 15rpx;
			border-radius: 50%;
			margin-bottom: 20rpx;
		}

		span {
			display: flex;
			align-items: center;
			justify-content: center;
			font-size: 24rpx;
			color: #e0cd26
		}
	}

	.addBtn4 {
		bottom: 660rpx;

		image {
			width: 90rpx;
			height: 90rpx;
		}
	}

	.addBtn3 {
		bottom: 490rpx;

		image {
			width: 90rpx;
			height: 90rpx;
		}
	}

	.addBtn2 {
		bottom: 320rpx;
	}


	.textBox {
		position: absolute;
		padding: 0;
		left: 0;
		right: 0;
		bottom: 0;
		top: 0;
		z-index: 100;
		border-radius: 100%;
		list-style: none;
		overflow: hidden;
	}

	.seeUserBox {
		background-color: #fff;
		box-sizing: border-box;

		.header {
			padding: 30rpx;
		}
	}

	.seeMe {
		display: flex;
		width: 100%;
		position: relative;

		image {
			width: 100rpx;
			height: auto;
			margin-right: 10rpx;
		}

		.text {
			display: flex;
			flex-direction: column;
			margin-left: 15rpx;

			.name {
				font-size: 32rpx;
			}

			.nickname {
				font-size: 24rpx;
				color: #ccc;
			}

			.small {
				position: absolute;
				right: 30rpx;
				top: 50%;
				transform: translateY(-50%);
				font-size: 12px;
				border: 1px solid #96a098;
				color: #96a098;
				padding: 5rpx 20rpx;
				text-align: center;
				border-radius: 10rpx;
				background-color: #e8ede9;
			}
		}
	}

	.addUserlist {
		display: flex;
		align-items: center;
		justify-content: space-between;
		flex-wrap: wrap;
		border-top: 1px solid #eee;

		.list {
			width: 33%;
			border-bottom: 1px solid #eee;
			height: 130rpx;
			display: flex;
			align-items: center;
			justify-content: center;
			flex-direction: column;
			font-size: 30rpx;
			border-right: 1px solid #eee;

			.desc {
				font-size: 26rpx;
				color: #a8a4a4;
				margin-top: 10rpx;
			}
		}

		.disabled {
			span {
				color: #a8a4a4 !important;
			}
		}
	}

	.borderNoneBox {
		.list {
			border: none;
			width: 50%;
		}
	}

	.createFirstForm {
		padding: 20rpx 40rpx;
		width: 650rpx;

		.label {
			text-align: center;
			padding: 10rpx 0 40rpx 0;
		}

		.form {
			.list {
				display: flex;
				align-items: center;
				border-bottom: 1px solid #e5e5e5;
				padding: 20rpx 0;

				.form_label {
					display: block;
					min-width: 120rpx;
					margin-right: 20rpx;
					font-size: 30rpx;
				}

				.red {
					color: red;
				}
			}
		}

		.createBtn {
			width: 100%;
			height: 70rpx;
			display: flex;
			align-items: center;
			justify-content: center;
			background-color: #de4849;
			color: #fff;
			border-radius: 10rpx;
			margin: 30rpx auto;
			font-size: 28rpx;
		}
	}

	.showShare {
		background-color: #fff;
		border-radius: 20rpx;
		overflow: hidden;

		.downLoadBox {
			padding: 40rpx 50rpx 20rpx 50rpx;
		}

		.title {
			text-align: center;
			margin-bottom: 30rpx;
			color: #747474;
			letter-spacing: 1px;
			font-size: 32rpx;
			font-weight: bold;

		}

		.btns {
			display: flex;
			margin-top: 40rpx;
			justify-content: space-between;
			align-items: center;
			padding: 0 50rpx 30rpx 50rpx;

			view {
				width: 45%;
				height: 70rpx;
				display: flex;
				align-items: center;
				justify-content: center;
				background-color: #de4849;
				color: #fff;
				border-radius: 10rpx;
				font-size: 28rpx;
				position: relative;

			}

			.shareBtn {
				position: absolute;
				left: 0;
				right: 0;
				bottom: 0;
				top: 0;
				background-color: red;
				z-index: 10;
				opacity: 0;
			}
		}
	}


	.guanxi {
		display: flex;
		flex-direction: column;
		position: absolute;
		bottom: 92rpx;
		left: 34rpx;
		align-items: center;

		image {
			width: 50rpx;
		}

		.text {
			font-size: 24rpx;
		}
	}

	.yaoqing {
		display: flex;
		flex-direction: column;
		position: absolute;
		bottom: 22rpx;
		left: 50%;
		align-items: center;
		transform: translateX(-50%);

		image {
			width: 50rpx;
		}

		.text {
			font-size: 24rpx;
		}
	}

	.tianjia {
		display: flex;
		flex-direction: column;
		position: absolute;
		bottom: 92rpx;
		right: 49rpx;
		align-items: center;

		image {
			width: 50rpx;
		}

		.text {
			font-size: 24rpx;
		}
	}

	.cnav {
		width: 1px;
		height: 1px;
		overflow: visible;
		position: relative;
		color: #fff;
		margin: 160px auto;
	}

	.cnav-center {
		position: absolute;
		background-image: url('https://cdn-oss.familylove.online/user/kmh/image/familylistbg.jpg');
		left: -100px;
		top: -100px;
		width: 200px;
		height: 200px;
		border-radius: 50%;
		overflow: hidden;
		z-index: 90;
		box-sizing: border-box;
	}

	.cnav-r {
		width: 300px;
		height: 300px;
		overflow: hidden;
		transform: rotate(0deg);
		opacity: 0;
		border-radius: 50%;
		position: absolute;
		left: -150px;
		top: -150px;
		z-index: 50;
		transition: all ease-in-out 0.5s;
	}

	.cnav-r-one {
		width: 300px;
		height: 300px;
		position: absolute;
		top: -147px;
		left: -150px;
		transform-origin: 300px 300px;
		color: #fff;
		box-sizing: border-box;
	}

	.cnav-r-one:nth-child(1) {
		transform: rotate(0deg) skewX(0deg);
		background: #e83828;
	}

	.cnav-r-one:nth-child(2) {
		transform: rotate(60deg) skewX(0deg);
		background: #f39800;
	}

	.cnav-r-one:nth-child(3) {
		transform: rotate(120deg) skewX(0deg);
		background: #f8b62d;
	}

	.cnav-r-one:nth-child(4) {
		transform: rotate(180deg) skewX(0deg);
		background: #dae000;
	}

	.cnav-r-one:nth-child(5) {
		transform: rotate(240deg) skewX(0deg);
		background: #ccc;
	}

	.cnav-r-one:nth-child(6) {
		transform: rotate(300deg) skewX(0deg);
		background: #eee;
	}

	.changebtns {
		position: fixed;
		bottom: 15%;
		left: 50%;
		transform: translateX(-50%);
		display: flex;
		align-items: center;
		width: 600rpx;
		justify-content: space-between;

		.btn {
			width: 190rpx;
			height: 80rpx;
			background-color: #fff;
			display: flex;
			align-items: center;
			justify-content: center;
			border-radius: 10rpx;
			font-size: 28rpx;
		}
	}

	.wechatqun {
		padding: 30rpx;
		background-color: #fff;
		border-radius: 20rpx;
		box-sizing: border-box;

		image {
			width: 500rpx;
			height: auto;
		}

		.title {
			text-align: center;
			margin-bottom: 25rpx;
			font-weight: bold;
			letter-spacing: 1px;
		}

		.desc {
			text-align: center;
			margin-top: 20rpx;
			font-size: 26rpx;
			color: #a8a4a4;
		}
	}

	.cnav-r-one a {
		transform-origin: 100% 100%;
		display: block;
		width: 130px;
		height: 20px;
		position: absolute;
		right: 0;
		bottom: -10px;
		line-height: 30px;
		transform: skewX(0) rotate(45deg);
		text-align: center;
		transform-origin: 100% 10px;
		color: #fff;
		line-height: 20px;
		text-decoration: none;
	}

	.cnav-r-one a span {
		display: block;
		text-align: center;
		width: 100px;
		height: 40px;
		position: absolute;
		left: -30px;
		top: -10px;
		transform: rotate(-90deg);
		overflow: visible;
		cursor: pointer;
	}

	.csubnav-1 {
		opacity: 1;
		transform: rotate(0);
		z-index: 51;
	}

	.shareBtnsss {
		height: 70rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		background-color: #de4849;
		color: #fff;
		border-radius: 10rpx;
		font-size: 28rpx;
		position: relative;
		width: 100%;
		margin-top: 30rpx;
	}


	.chatDiaBox {
		width: 700rpx;
		box-sizing: border-box;
		padding: 30rpx;
		height: 400rpx;

		.listbox {
			background-color: #245dff;
			padding: 30rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;
			border-radius: 10rpx;
			margin-top: 50rpx;
			display: flex;
			align-items: center;
			justify-content: center;
			height: 100rpx;
			color: #fff;
			font-size: 30rpx;
		}

		.title {
			text-align: center;
			margin-bottom: 30rpx;
			margin-top: 10rpx;
		}

		.check {
			width: 100%;
			height: 80rpx;
			display: flex;
			align-items: center;
			justify-content: center;
			border: 1px solid #ccc;
			font-size: 28rpx;
			border-radius: 10rpx;
		}
	}
</style>